<template>
    <div style="height: 100vh;z-index: 1;position: relative;background-color:#f5f5f5;">
        <div class="set-item">
            <div style="border-bottom: 0.1px solid #f5f5f5">
                <span style="font-size: 18px;font-weight: bold;">头像</span>
                <img style="width: 15vw;padding-right: 5vw" src="../assets/img/touxiang.png">
            </div>
            <div>
                <span style="font-size: 18px;font-weight: bold;">用户名</span>
                <span>wjd17333501984</span>
            </div>
            <h3>账号绑定</h3>
            <div>
                <span style="font-size: 18px;font-weight: bold;">手机号</span>
                <span>173****1984</span>
            </div>
            <h3>安全设置</h3>
            <div>
                <span>登录密码</span>
                <span>未设置</span>
            </div>
            <div @click="exit_login">退出登录</div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "settings",
        methods:{
            exit_login(){
                this.$store.commit('changeIslogin')
                this.$router.push({
                    path:'/profile'
                })
            }
        }
    }
</script>

<style scoped>
    h3{
        color: #999999;
        margin: 0;
        padding: 2vw 8vw;
        font-size: 14px;
        font-weight: normal;
    }

    .set-item>div{
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 2vh 5vw;
    }
    .set-item>div:nth-child(7){
        justify-content: center;
        color: #ff5339;
        font-weight: bold;
        margin-top: 4vh;
    }
</style>